<nz-breadcrumb class="breadcrumb-pos">
  <i nz-icon type="link" theme="outline" style="color:#1890FF;padding-right:4px"></i>
  <nz-breadcrumb-item>
    账号管理
  </nz-breadcrumb-item>
</nz-breadcrumb>
<div nz-row [nzGutter]="24" style="border-bottom: 1px solid #ccc;margin-bottom: 8px;">
  <div nz-col [nzSpan]="6">
    <nz-form-item nzFlex>
      <nz-form-label>账号</nz-form-label>
      <nz-form-control>
        <input nz-input [(ngModel)]="username">
      </nz-form-control>
    </nz-form-item>
  </div>
  <div nz-col [nzSpan]="6">
    <nz-form-item nzFlex>
      <nz-form-label>名称</nz-form-label>
      <nz-form-control>
        <input nz-input [(ngModel)]="name">
      </nz-form-control>
    </nz-form-item>
  </div>
  <div nz-col [nzSpan]="9">
    <nz-form-item nzFlex>
      <nz-form-label>手机号</nz-form-label>
      <nz-form-control>
        <input style="display:none;">
        <input nz-input [(ngModel)]="mobile" autocomplete="off" >
      </nz-form-control>
      <button nz-button [nzType]="'primary'" [nzLoading]="btn_loading" style="margin:3px 0 0 20px;" (click)="getAcountlist()">查询</button>
    </nz-form-item>
  </div>
</div>

<div class="add_btn">
  <button nz-button nzType="primary" routerLink="/main/addacount"><i nz-icon type="plus"></i>添加</button>
</div>
<nz-table #basicTable [nzData]="roleslist" [nzLoading]="loading" [nzShowPagination]="false" [nzBordered]="true">
  <thead>
    <tr>
      <th>编号</th>
      <th>账号</th>
      <th>名称</th>
      <th>手机号</th>
      <th>账号类型</th>
      <th>状态</th>
      <th>创建时间</th>
      <th>备注</th>
      <th>操作</th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let data of roleslist">
      <td>{{data.id}}</td>
      <td>{{data.username}}</td>
      <td>{{data.name}}</td>
      <td>{{data.mobile}}</td>
      <td>{{data.typeStr}}</td>
      <td>{{data.statusStr}}</td>
      <td>{{data.dateAdd.slice(0,10)}}</td>
      <td>{{data.remark}}</td>
      <td class="td_btn">
        <a *ngIf="localUsername !== data.username && data.type !==1" routerLink="/main/editacount/{{data.id}}">编辑</a>
        <nz-popconfirm style="margin-right:10px" [nzTitle]="'确定要改变该账号状态么?'" (nzOnConfirm)="editStatus(data.id,data.status)">
          <a nz-popconfirm *ngIf="localUsername !== data.username && data.type !==1" style="color:rgb(88, 35, 212)">{{data.status==0?"禁用":"启用"}}</a>
        </nz-popconfirm>
        <nz-popconfirm [nzTitle]="'确定要删除么?'" (nzOnConfirm)="delete(data.id)">
          <a nz-popconfirm *ngIf="localUsername !== data.username && data.type !==1" style="color:#E48675">删除</a>
        </nz-popconfirm>
        <br>
        <a *ngIf="localUsername !== data.username && data.type !==1" style="color:rgb(190, 28, 109)" (click)="resetPwd()">重置密码</a>
        <nz-modal [(nzVisible)]="isVisible" nzTitle="重 置 密 码" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk(data.id)">
            <nz-form-label nzRequired nzFor="password">重置密码</nz-form-label>
            <input type="password" nz-input [(ngModel)]="password" (focus)="onFocus()" placeholder="请输入密码">
            <nz-form-explain class="checkResult" *ngIf="pwdcord==-1">请输入密码!</nz-form-explain>
        </nz-modal>
      </td>
    </tr>
  </tbody>
</nz-table>
<nz-pagination style="float:right;margin-top:12px" [nzPageIndex]="PageIndex" [nzPageSize]="PageSize" [nzTotal]="PageTotal" (nzPageIndexChange)="PageIndexChange($event)" [nzHideOnSinglePage]="true" [nzShowTotal]="totalTemplate"></nz-pagination>
<ng-template #totalTemplate let-total>
  共 {{total}} 条数据
</ng-template>
<br>
<router-outlet></router-outlet>